<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="UTF-8" />
		<meta name="author" content="wangbo" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>新增的标签</title>
	</head>
	<body>
		<!-- h5 为了弥补以前的不足 新增了一些表,或者是属性,但是都有兼容性的问题,IE9以上才可以 -->
		<!-- 以前分模块 ,以前用id 来给页面分模块 -->
		<div id="top">顶部</div>
		<div id="banner">导航条</div>
		<div id="header">头部</div>
		<div id="nav">导航</div>
		<div id="main">中间</div>
		<div id="footer">底部模块</div>
    <!-- 新增的模块标签都是块元素
    是标签具有语义化,有利于搜索引擎的搜索,h1-6  meat标签里边的keywork,a标签
    -->
    <header>头部模块   </header>   
    <nav> 导航模块 </nav>
    <main> 主体模块 
      <article>写文章用的到</article>
      <aside>侧边栏</aside>  
      <aside>侧边栏</aside>  
    </main>
    <footer>底部模块</footer>
    <!-- 多媒体标签,音频标签audio 视频标签 vido -->
    <!-- autoplay自动播放,谷歌浏览器需要加入muted 静音播放
        controls 显示视频的控件 
        width 设置宽   height 设置高
        loop 循环播放
    -->
    <!-- <video src="./Bloom of Youth.avi" autoplay muted loop   controls width="400px" height="400px" ></video> -->
    <!-- 预加载,视频比较大,需要提前加载进来 preload 预加载 auto 自动 poster 加载视频的时候显示的图片
    有些像爱奇艺,播放器
    -->
    <!-- <video src="./Bloom of Youth.avi" preload="auto" poster="./tudou.jpg" 
     loop   controls width="400px" height="400px" ></video> -->
	</body>
</html>
